<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Vue3</title>
	<link rel="stylesheet" href="../modules/common.css" />
	<link rel="stylesheet" href="../modules/element-plus.css" />
	<script src="../modules/vue.global.prod.js"></script>
	<script src="../modules/element-plus.js"></script>
	<script src="../modules/element-plus-zh-cn.js"></script>
	<script src="../modules/element-plus-en.js"></script>
	<script src="../modules/element-plus-zh-tw.js"></script>
	<script src="../modules/element-plus-icons.js"></script>
	<script src="../modules/zot-render-element-plus.js"></script>
	<script src="../modules/echarts.min.js"></script>
	<script src="vue3.js"></script>

	<script>
		var { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm");
		Services.scriptloader.loadSubScript("chrome://zotero/content/include.js", this);
		Services.scriptloader.loadSubScript("resource://zotero/require.js", this);

		Services.scriptloader.loadSubScript("chrome://zotero/content/customElements.js", this);
	</script>
</head>

<body>
	<div id="app">
		<span ref="el">123<span id="id"></span></span>
		<el-button @click="onClick" ref="btn"></el-button>
		
		{{ text }}
		<iframe id="editor-view" style="border: 0;width: 100%;flex-grow: 1;" src="resource://zotero/note-editor/editor.html" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" type="content"/>
		<p v-for="n in 300"> {{ n }} </p>
	</div>
</body>
</html>